<template>
  <j-modal
    :confirmLoading="confirmLoading"
    :maskClosable="false"
    :visible="visible"
    :width="500"
    switchFullscreen
    title="车辆销售开票登记(为必填项)"
    @cancel="handleCancel"
    @ok="handleOk"
  >
    <a-spin :spinning="confirmLoading">
      <!-- 主表单区域 -->
      <a-form-model ref="ruleForm"
                    :label-col="labelCol"
                    :model="model"
                    :rules="rules" :wrapper-col="wrapperCol">
        <a-form-model-item label="识别代码(VIN) " prop="vin">
          <a-input v-model="model.vin" placeholder="请输入识别代码"/>
        </a-form-model-item>
        <a-form-model-item label="车辆发票类型" prop="invoiceType">
          <a-select v-model="model.invoiceType" placeholder="请选择车辆发票类型">
            <a-select-option value="1">
              纸质发票
            </a-select-option>
            <a-select-option value="2">
              电子发票
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="发票代码 " prop="code">
          <a-input v-model="model.code"/>
        </a-form-model-item>
        <a-form-model-item label="发票编号 " prop="no">
          <a-input v-model="model.no"/>
        </a-form-model-item>
        <a-form-model-item label="开票日期  " prop="date">
          <a-date-picker
            v-model="model.date"
            format="YYYY-MM-DD"
            style="width: 100%"
            @openChange="onChangeDeliverDate"
          />
        </a-form-model-item>
        <a-form-model-item label="税率  " prop="taxRate">
          <a-input v-model="model.taxRate"/>
        </a-form-model-item>
        <a-form-model-item label="不含税价(元)  " prop="excludingTaxPrice">
          <a-input v-model="model.excludingTaxPrice" allow-clear placeholder="请输入不含税价" prefix="￥"
                   suffix="元"></a-input>
        </a-form-model-item>
        <a-form-model-item label="发票金额(元) " prop="invoiceAmount">
          <a-input v-model="model.invoiceAmount" allow-clear placeholder="请输入发票金额" prefix="￥"
                   suffix="元"></a-input>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
    <div>备注：(若有退票可将客户退回的原发票编号记录在备注栏内)</div>
    <a-textarea :rows="4" style="margin-top: 10px"/>
    <!--<a-button type="primary" @click="saveDraft">暂存</a-button>-->
  </j-modal>
</template>

<script>
import { getAction, httpAction, postAction } from '@/api/manage'
import moment from 'moment'

export default {
  name: 'VehicleRegisterModel',
  data() {
    return {
      title: '交易信息',
      visible: false,
      model: {},
      saleSource: [],
      SaleInfosLike: [],
      labelCol: {
        span: 7
      },
      wrapperCol: {
        span: 15
      },

      confirmLoading: false,
      form: this.$form.createForm(this),
      validatorRules: {},
      url: {
        add: '/sale/cxmSaleInvoiceInfo/addInvoiceInfo',
        edit: '/cxm/cxmOrderManager/edit',
        saveDraft: 'cxm/cxmCommonBusiness/saveDraft',
        getDraft: 'cxm/cxmCommonBusiness/getDraft',
        getSaleInfosLike: 'cxm/cxmSalesInfo/getSaleInfosLike',
        getSaleInfos: '/cxm/cxmOrderManager/getSaleInfos'
      },
      rules:
        {
          //车管验证条件
          // orderId: [{ required: true, message: '请输入订单编号', trigger: 'blur' }],
          vin: [{ required: true, message: '请输入车辆识别代码', trigger: 'blur' },
            { message: '请输入正确的VIN码', pattern: new RegExp(/^[A-HJ-NPR-Z\d]{17}$/) }],
          invoiceType: [{ required: true, message: '请选择车辆发票类型', trigger: 'blur' }],
          code: [{ required: true, message: '请输入发票代码', trigger: 'blur' }],
          no: [{ required: true, message: '请输入发票编号', trigger: 'blur' }],
          date: [{ required: true, message: '请选择开票日期', trigger: 'blur' }],
          taxRate: [{ required: true, message: '请输入税率', trigger: 'blur' }],
          excludingTaxPrice: [{ required: true, message: '请输入不含税价', trigger: 'blur' }],
          invoiceAmount: [{ required: true, message: '请输入发票金额', trigger: 'blur' }]
        },
      showDing: false,
      showEnterpriseUscc: false
    }
  },
  created() {
  },
  methods: {
    onChangeDeliverDate() {
      setTimeout(this.validate_Date2, 100)
    },
    validate_Date2() {
      this.$refs['ruleForm'].validateField('date')
    },
    saleSelect(value) {
      console.log('saleSelect', value)
      for (let i = 0; i < this.SaleInfosLike.length; i++) {
        if (this.SaleInfosLike[i].salesName == value) {
          this.form.setFieldsValue({
            salesPhone: this.SaleInfosLike[i].salesPhone
          })
        }
      }
    },
    saleChange() {
      setTimeout(() => {
        console.log(this.form.getFieldValue('salesName'))
        let httpurl = this.url.getSaleInfosLike
        let params = {
          salesName: this.form.getFieldValue('salesName')
        }
        getAction(httpurl, params).then((res) => {
          /* res = {};
          res.success = true; */
          if (res.success) {
            /* res.result = [{
              "salesName": "刘里2",
              "salesPhone": "1321321321323"
            }, {
              "salesName": "刘醒2",
              "salesPhone": "1545454541212"
            }]; */
            this.SaleInfosLike = res.result
            this.saleSource = []
            for (let i = 0; i < res.result.length; i++) {
              this.saleSource.push(res.result[i].salesName)
              if (i > 8) {
                break
              }
            }
          }
        })
      }, 100)
    },
    add() {
      const that = this
      let httpurl = this.url.getDraft
      let params = {
        bType: 'order'
      }
      that.edit()
      // getAction(httpurl, params).then((res) => {
      //   if (res.success) {
      //     if (res.result) {
      //       that.edit(JSON.parse(res.result))
      //     } else {
      //       getAction(that.url.getSaleInfos, params).then((res) => {
      //         that.edit(res.result)
      //       })
      //     }
      //   } else {
      //     that.edit({})
      //   }
      // })
    },
    edit(record) {
      // console.log(record)
      // this.form.resetFields()
      // this.model = Object.assign({}, record)
      // console.log(this.model)
      this.visible = true
      // this.$nextTick(() => {
      //   this.form.setFieldsValue({
      //     batteryNumber: this.model.batteryNumber,
      //     businessAddress: this.model.businessAddress,
      //     carBrand: this.model.carBrand,
      //     carColor: this.model.carColor,
      //     carModel: this.model.carModel,
      //     carType: this.model.carModel,
      //     carTypeConfiguration: this.model.carTypeConfiguration,
      //     carVin: this.model.carVin,
      //     depositAttribute: this.model.depositAttribute,
      //     depositContent: this.model.depositContent,
      //     documentNumber: this.model.documentNumber,
      //     documentType: this.model.documentType,
      //     engineNumber: this.model.engineNumber,
      //     enterpriseId: this.model.enterpriseId,
      //     enterpriseName: this.model.enterpriseName,
      //     enterpriseUscc: this.model.enterpriseUscc,
      //     epositAmount: this.model.epositAmount,
      //     fuelType: this.model.fuelType,
      //     importEngineNumber: this.model.importEngineNumber,
      //     importProveNumber: this.model.importProveNumber,
      //     interiorColor: this.model.interiorColor,
      //     isNewCar: this.model.isNewCar,
      //     orderDate: this.model.orderDate ? moment(this.model.orderDate) : null,
      //     orderNumber: this.model.orderNumber,
      //     operationAddr: this.model.operationAddr,
      //     ownerName: this.model.ownerName,
      //     ownerPhone: this.model.ownerPhone,
      //     qualifiedNumber: this.model.qualifiedNumber,
      //     quoteAmount: this.model.quoteAmount,
      //     registerDistinct: this.model.registerDistinct,
      //     salesName: this.model.salesName,
      //     salesPhone: this.model.salesPhone
      //   })
      // })
      // if (this.model.enterpriseUscc) {
      //   this.showEnterpriseUscc = true
      // } else {
      //   this.showEnterpriseUscc = false
      // }

    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleOk() {
      const that = this
      // 触发表单验证
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          httpurl += this.url.add
          // if (!this.model.id) {
          //   httpurl += this.url.add
          //
          //   method = 'post'
          // } else {
          //   httpurl += this.url.edit
          //   method = 'put'
          // }
          let formData = Object.assign(this.model)
          //时间格式化
          formData.date = formData.date ? formData.date.format('YYYY-MM-DD HH:mm:ss') : null

          postAction(httpurl, formData)
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
              that.close()
            })
        }
      })
    },
    saveDraft() {
      const that = this
      this.form.validateFields((err, values) => {
        let formData = Object.assign(this.model, values)
        //时间格式化
        formData.orderDate = formData.orderDate ? formData.orderDate.format('YYYY-MM-DD HH:mm:ss') : null
        let httpurl = this.url.saveDraft

        console.log(JSON.stringify(formData))
        let Data = {}
        Data.btype = 'order'
        Data.content = JSON.stringify(formData)
        console.log(Data)
        httpAction(httpurl, Data, 'post')
          .then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$emit('ok')
            } else {
              that.$message.warning(res.message)
            }
          })
          .finally(() => {
            that.confirmLoading = false
            that.close()
          })
      })

    },
    handleCancel() {
      this.close()
    }
  }
}
</script>

<style lang="less" scoped>
</style>